<%@ page contentType="text/html;charset=UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
<!DOCTYPE html>
<html>

<head>
    <title>
        问卷统计
    </title>
    <link href="${ctx}/static/inspinia/js/plugins/iCheck/dcwj.css" rel="stylesheet">
</head>
<body>
<span class="navbar-right  m-r m-t-8"><a href="${ctx}/admin/ehm/question/list" class="btn-primary btn-add "> <i class='fa fa-plus-square-o'></i>返 回</a></span>
    <div id="wrapper">
        <div class="gray-bg p-sm">

            <div class="row">
                <div class="col-lg-12">
                        <div class="tabs-container">
                            <ul class="nav nav-tabs">
                                <li class="active"><a  href="javascript:void(0)">问卷分析</a></li>
                                <li class=""><a  href="${ctx}/admin/ehm/question/tz/lb/edit">列表分析</a></li>
                            </ul>
                        </div>
                   <div class="dcwj white-bg">
                       <div class="dcwj-content p-md">
                           <c:if test="${!sys_flag}">
                               <form role="form" class="form-inline" id="queryform">
                                   <label for="companyId">
                                   <select id="companyId" name="companyId"  class="form-control form-filter" form="queryform" style="width:100%">
                                   <option value="">请选择企业</option>
                                    <c:forEach var="items" items="${company}">
                                       <option value="${items.id}" <c:if test="${items.id == companyId}">selected="true"</c:if>  >${items.title}</option>
                                    </c:forEach>
                                   </select></label>
                                   <button class="btn btn-primary" type="button" onclick="query()"> 查询</button>
                               </form>
                           </c:if>
                           <div class="dcwj-content-border m-b">
                               <h3>调查人数:  <span>${count}</span></h3>
                           </div>
                           <div id="showDiv">

                           </div>
                       </div>

                   </div>
                </div>
            </div>
        </div>
    </div>
    <script type="text/javascript">
        $(document).ready(function() {
           var show = JSON.parse('${data}');
            var content = "";
            for (i in show) {
                    content += "<h4>"+show[i].title+"</h4>";
                    var itemData = show[i].items;
                    for (var j = 0 ; j<itemData.length ; j++) {
                        if(j == itemData[j].count){
                            var color = "color"+(j+1)
                            content+="<div class='progressbar'>"+
                                "<span class='progressbar-title'>"+itemData[j].title+"&nbsp;:</span>"+
                                "<div class='bar "+color+"'></div>"+
                                "<span class='progressbar-width'>"+itemData[j].percentile+"</span>"+
                                "<span class='progressbar-perc'>%</span>"+
                                "</div>";
                        }
                    }
            }
            $("#showDiv").append(content);
            init();
        });


        function init() {
            $('.progressbar').each(function(){
                var t = $(this);
                var dataperc= t.find('.progressbar-width').text();
                var barperc = Math.round(dataperc*3.65);
                t.find('.bar').animate({width:barperc}, dataperc*25);
            });
        }
        
        function query() {
            var companyId = $("#companyId").val();
            console.log("1"+companyId);
            if(companyId!=null && companyId!=undefined && companyId!=''){
                location.href='${ctx}/admin/ehm/question/tz/edit?companyId='+companyId;
                console.log("2");
            }
        }

    </script>

</body>

</html>
